<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Коллекция природных артефактов</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"/>
    <link rel="stylesheet" href="css/main.css">
    <script src="https://kit.fontawesome.com/23c29be8bd.js" crossorigin="anonymous"></script>
</head>
<body>
    <header>
        <div class="menu-container container">
            <a href="#" class="menu-logo">
                <svg width="65" height="20" viewBox="0 0 65 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M13.7389 5.41974C13.7389 5.45901 13.6773 5.48846 13.5541 5.5081C13.4514 5.52774 13.3898 5.5081 13.3693 5.44919C13.0407 4.31026 12.4862 3.46588 11.7058 2.91605C10.9254 2.36623 9.8986 2.09131 8.62534 2.09131H7.70119C7.0851 2.09131 6.6333 2.21895 6.34578 2.47423C6.05827 2.7295 5.91452 3.12224 5.91452 3.65243V10.0147H8.13246C9.32358 10.0147 10.2272 9.81836 10.8433 9.42563C11.4799 9.01326 11.7982 8.45361 11.7982 7.74669C11.7982 7.70741 11.8598 7.68778 11.9831 7.68778C12.1063 7.68778 12.1679 7.70741 12.1679 7.74669L12.1371 10.4271C12.1371 11.0555 12.1473 11.5268 12.1679 11.8409L12.1987 13.4021C12.1987 13.461 12.1371 13.4904 12.0139 13.4904C11.8906 13.4904 11.829 13.461 11.829 13.4021C11.829 12.6166 11.5004 11.998 10.8433 11.5464C10.2066 11.0751 9.29277 10.8395 8.10166 10.8395H5.91452V17.1429C5.91452 17.7516 5.99666 18.2032 6.16095 18.4978C6.32525 18.7923 6.6333 18.9985 7.0851 19.1163C7.5369 19.2342 8.24541 19.2931 9.21063 19.2931C9.2517 19.2931 9.27224 19.352 9.27224 19.4698C9.27224 19.5876 9.2517 19.6465 9.21063 19.6465C8.36863 19.6465 7.71146 19.6367 7.23912 19.6171L4.09703 19.5876L1.78668 19.6171C1.37595 19.6367 0.811192 19.6465 0.0924143 19.6465C0.0308048 19.6465 0 19.5876 0 19.4698C0 19.352 0.0308048 19.2931 0.0924143 19.2931C0.811192 19.2931 1.33487 19.244 1.66346 19.1458C1.99204 19.0476 2.20768 18.8611 2.31036 18.5862C2.43358 18.2916 2.49519 17.8498 2.49519 17.2607V3.62298C2.49519 3.03387 2.44385 2.60187 2.34116 2.32695C2.23848 2.05204 2.03312 1.86549 1.72507 1.7673C1.41702 1.64948 0.94468 1.59057 0.308048 1.59057C0.246438 1.59057 0.215633 1.53166 0.215633 1.41384C0.215633 1.29602 0.246438 1.23711 0.308048 1.23711H13.3693C13.5746 1.23711 13.6773 1.32548 13.6773 1.50221L13.7389 5.41974Z" fill="white"/>
                    <path d="M42.5652 8.45361C43.0786 8.45361 43.3353 8.75798 43.3353 9.36672C43.3353 9.85763 43.1916 10.3387 42.9041 10.81C42.6371 11.2617 42.2674 11.6348 41.7951 11.9293C41.3228 12.2239 40.8196 12.3711 40.2857 12.3711C39.7106 12.3711 38.9713 12.1649 38.0677 11.7526C37.6981 14.4428 36.7534 16.4948 35.2337 17.9087C33.7345 19.3029 31.8657 20 29.6272 20C28.2307 20 26.978 19.6858 25.869 19.0574C24.7806 18.4094 23.9283 17.5552 23.3122 16.4948C22.6961 15.4345 22.3881 14.2857 22.3881 13.0486C22.3881 12.5184 22.4497 11.9882 22.5729 11.458C22.8194 10.4173 23.2917 9.47472 23.9899 8.63034C24.6882 7.78596 25.5096 7.12813 26.4543 6.65685C27.399 6.18557 28.354 5.94993 29.3192 5.94993C30.346 5.94993 31.188 6.22484 31.8452 6.77467C33.0773 5.45901 33.6934 4.31026 33.6934 3.32842C33.6934 2.95533 33.6318 2.6706 33.5086 2.47423C33.3854 2.25822 33.2108 2.06186 32.9849 1.88513C32.8206 1.72803 32.6974 1.59058 32.6153 1.47275C32.5331 1.35493 32.4921 1.18802 32.4921 0.972019C32.4921 0.677467 32.5845 0.441826 32.7693 0.265096C32.9541 0.0883652 33.1903 0 33.4778 0C33.9296 0 34.2993 0.196368 34.5868 0.589103C34.8743 0.981837 35.0181 1.50221 35.0181 2.15022C35.0181 3.24988 34.5868 4.36917 33.7243 5.5081C32.8617 6.64703 31.8246 7.71723 30.613 8.7187C29.4013 9.70054 27.8816 10.8493 26.0539 12.1649L24.2672 13.4904C24.4725 14.5508 24.8935 15.4934 25.5302 16.3181C26.1668 17.1232 26.9267 17.7516 27.8097 18.2032C28.7133 18.6352 29.658 18.8513 30.6438 18.8513C32.5126 18.8513 34.0631 18.2229 35.2953 16.9661C36.548 15.7094 37.3079 13.9028 37.5748 11.5464L36.9896 11.2518C36.127 10.8198 35.439 10.5056 34.9256 10.3093C34.4122 10.0933 33.9193 9.98527 33.447 9.98527C33.1595 9.98527 32.9233 10.0442 32.7385 10.162C32.5742 10.2798 32.4921 10.4271 32.4921 10.6038C32.4921 10.8395 32.5742 11.1144 32.7385 11.4286C32.9028 11.782 32.9849 12.0373 32.9849 12.1944C32.9849 12.3711 32.9233 12.538 32.8001 12.6951C32.6769 12.8326 32.4921 12.9013 32.2456 12.9013C31.9992 12.9013 31.7938 12.8326 31.6295 12.6951C31.4858 12.538 31.4139 12.2926 31.4139 11.9588C31.4139 11.4482 31.5782 10.9573 31.9068 10.486C32.2559 10.0147 32.6974 9.64163 33.2314 9.36672C33.7859 9.07217 34.3506 8.92489 34.9256 8.92489C35.439 8.92489 35.9627 9.03289 36.4967 9.2489C37.0512 9.44526 37.7289 9.73981 38.5298 10.1325C39.187 10.4664 39.7517 10.7315 40.2241 10.9278C40.6964 11.1046 41.1277 11.1929 41.5179 11.1929C41.7848 11.1929 42.0005 11.1438 42.1648 11.0457C42.3496 10.9278 42.442 10.7904 42.442 10.6333C42.442 10.4566 42.3393 10.2307 42.1339 9.95582C42.0107 9.79872 41.9183 9.66127 41.8567 9.54345C41.7951 9.42563 41.7643 9.28817 41.7643 9.13107C41.7643 8.67943 42.0313 8.45361 42.5652 8.45361ZM24.2672 10.5155C24.1645 11.1438 24.1132 11.674 24.1132 12.106C24.1132 12.322 24.1337 12.6264 24.1748 13.0191C24.7293 12.5871 25.3043 12.1551 25.8998 11.7231C27.7687 10.3486 29.2268 9.20962 30.2741 8.30633C29.7607 7.26559 28.9187 6.74521 27.7481 6.74521C26.9472 6.74521 26.2284 7.10849 25.5918 7.83505C24.9757 8.54197 24.5342 9.43544 24.2672 10.5155Z" fill="white"/>
                    <path d="M59.3627 9.30781C61.0878 9.50417 62.4535 10.054 63.4598 10.9573C64.4866 11.8606 65 12.9799 65 14.3152C65 15.3363 64.6919 16.2592 64.0759 17.0839C63.4598 17.9087 62.6075 18.5665 61.5191 19.0574C60.4306 19.5287 59.219 19.7644 57.8841 19.7644C57.3091 19.7644 56.6519 19.7349 55.9126 19.676C55.6251 19.6564 55.2657 19.6367 54.8344 19.6171C54.4237 19.5974 53.9616 19.5876 53.4482 19.5876L51.1995 19.6171C50.7887 19.6367 50.2342 19.6465 49.536 19.6465C49.4744 19.6465 49.4436 19.5876 49.4436 19.4698C49.4436 19.352 49.4744 19.2931 49.536 19.2931C50.1316 19.2931 50.5834 19.244 50.8914 19.1458C51.1995 19.028 51.4151 18.8316 51.5383 18.5567C51.6821 18.2622 51.7539 17.8301 51.7539 17.2607V3.62298C51.7539 2.79823 51.6102 2.25822 51.3227 2.00295C51.0352 1.72803 50.4499 1.59057 49.5668 1.59057C49.5257 1.59057 49.5052 1.53166 49.5052 1.41384C49.5052 1.29602 49.5257 1.23711 49.5668 1.23711L51.1995 1.26657C52.1441 1.30584 52.8937 1.32548 53.4482 1.32548C54.0232 1.32548 54.6188 1.29602 55.2349 1.23711C55.4403 1.21748 55.7483 1.19784 56.159 1.1782C56.5698 1.15857 56.9291 1.14875 57.2372 1.14875C59.106 1.14875 60.5538 1.47275 61.5807 2.12077C62.6075 2.76878 63.1209 3.71134 63.1209 4.94845C63.1209 5.89102 62.7923 6.74521 62.1352 7.51105C61.4985 8.27688 60.5744 8.8758 59.3627 9.30781ZM56.7751 1.79676C56.1796 1.79676 55.7688 1.93422 55.5429 2.20913C55.317 2.46441 55.2041 2.95533 55.2041 3.68188V9.27835L56.4363 9.30781C57.5042 9.30781 58.3256 8.92489 58.9007 8.15906C59.4757 7.39323 59.7632 6.41139 59.7632 5.21355C59.7632 4.09426 59.5065 3.24988 58.9931 2.68041C58.4797 2.09131 57.7403 1.79676 56.7751 1.79676ZM57.3604 19.028C60.0507 19.028 61.3958 17.6927 61.3958 15.0221C61.3958 13.5101 61.0159 12.3122 60.2561 11.4286C59.4962 10.5449 58.3462 10.1031 56.8059 10.1031C56.2104 10.1031 55.6764 10.1227 55.2041 10.162V17.2607C55.2041 17.9087 55.3376 18.3702 55.6045 18.6451C55.8715 18.9003 56.4568 19.028 57.3604 19.028Z" fill="white"/>
                </svg>
            </a>
            <nav class="menu-nav">
                <div class="nav_cont">
                    <a href="#catalog" class="nav-elem">Каталог</a>
                    <a href="#galery" class="nav-elem">Галерея</a>
                    <a href="#about" class="nav-elem">О лаборатории</a>
                    <a href="#contacts" class="nav-elem">Контакты</a>
                </div>
            </nav>
            <div class="right-menu">
                <form class="search">
                    <button class="search-btn" type="submit">
                        <svg width="349" height="337" viewBox="0 0 349 337" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path fill-rule="evenodd" clip-rule="evenodd" d="M334 134.5C334 200.498 280.498 254 214.5 254C148.502 254 95 200.498 95 134.5C95 68.502 148.502 15 214.5 15C280.498 15 334 68.502 334 134.5ZM349 134.5C349 208.782 288.782 269 214.5 269C179.923 269 148.393 255.952 124.566 234.512C124.358 234.749 124.134 234.977 123.892 235.192L12.5739 334.234C9.47931 336.987 4.73863 336.71 1.98531 333.616C-0.768005 330.521 -0.491347 325.78 2.60325 323.027L113.921 223.985C113.952 223.958 113.983 223.931 114.014 223.904C92.8554 200.14 80 168.821 80 134.5C80 60.2177 140.218 0 214.5 0C288.782 0 349 60.2177 349 134.5Z"/>
                        </svg>                            
                    </button>
                </form>
                <a href="#" class="login-btn">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
                        <path d="M352 96l64 0c17.7 0 32 14.3 32 32l0 256c0 17.7-14.3 32-32 32l-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0c53 0 96-43 96-96l0-256c0-53-43-96-96-96l-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32zm-9.4 182.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L242.7 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l210.7 0-73.4 73.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l128-128z"/>
                    </svg>
                </a>
            </div>
        </div>
    </header>
    <main>
        <section id="catalog" class="catalog">
            <div class="container">
                <div class="catalog-container">
                    <h1>Крупнейшая коллекция природных артефактов</h1>
                    <p class="text-content">
                        Являясь всего лишь частью общей картины, интерактивные прототипы, которые представляют собой яркий пример европейского типа политической и социальной культуры.
                    </p>
                    <a href="#" class="transition-link">Исследовать
                        <svg width="58" height="16" viewBox="0 0 58 16" xmlns="http://www.w3.org/2000/svg">
                            <path d="M57.7071 8.70711C58.0976 8.31658 58.0976 7.68342 57.7071 7.29289L51.3431 0.928932C50.9526 0.538408 50.3195 0.538408 49.9289 0.928932C49.5384 1.31946 49.5384 1.95262 49.9289 2.34315L55.5858 8L49.9289 13.6569C49.5384 14.0474 49.5384 14.6805 49.9289 15.0711C50.3195 15.4616 50.9526 15.4616 51.3431 15.0711L57.7071 8.70711ZM0 9L57 9V7L0 7L0 9Z"/>
                        </svg>                       
                    </a>
                </div>
            </div>
        </section>
        <section id="galery">
            <div class="container">
                <div class="swiper-container cards-container">
                    <div class="swiper-wrapper swiper-box">
                        <div class="card swiper-slide">
                            <div class="card-image">
                                <div class="card-digit">2.4</div>
                                <img src="img/fig1.png" alt="Fig 1">
                            </div>
                            <div class="card-text">
                                <h3 class="card-title">Fig. 1 (plant)</h3>
                                <p class="text">Имеется спорная точка зрения, гласящая примерно следующее: активно развивающиеся страны третьего мира своевременно верифицированы.</p>
                                <button class="card-btn">Подробнее</button>
                            </div>
                        </div>
                        <div class="card swiper-slide">
                            <div class="card-image">
                                <div class="card-digit">3.1</div>
                                <img src="img/fig2.png" alt="Fif 2">
                            </div>
                            <div class="card-text">
                                <h3 class="card-title">Fig. 2 (flower)</h3>
                                <p class="text">Прежде всего, синтетическое тестирование влечет за собой процесс внедрения и модернизации условий.</p>
                                <button class="card-btn">Подробнее</button>
                            </div>
                        </div>
                        <div class="card swiper-slide">
                            <div class="card-image">
                                <div class="card-digit">1.2</div>
                                <img src="img/fig3.png" alt="Fig 3">
                            </div>
                            <div class="card-text">
                                <h3 class="card-title">Fig. 3 (leaf)</h3>
                                <p class="text">Лишь непосредственные участники прогресса неоднозначны и будут в равной степени предоставлены сами себе для работы.</p>
                                <button class="card-btn">Подробнее</button>
                            </div>
                        </div>
                        <div class="card swiper-slide">
                            <div class="card-image">
                                <div class="card-digit">1.4</div>
                                <img src="img/fig4.png" alt="Fig 4">
                            </div>
                            <div class="card-text">
                                <h3 class="card-title">Fig. 4 (wood)</h3>
                                <p class="text">Базовый вектор развития не даёт нам иного выбора, кроме определения новых предложений.</p>
                                <button class="card-btn">Подробнее</button>
                            </div>
                        </div>
                        <div class="card swiper-slide">
                            <div class="card-image">
                                <div class="card-digit">2.4</div>
                                <img src="img/fig1.png" alt="Fig 1">
                            </div>
                            <div class="card-text">
                                <h3 class="card-title">Fig. 1 (plant)</h3>
                                <p class="text">Имеется спорная точка зрения, гласящая примерно следующее: активно развивающиеся страны третьего мира своевременно верифицированы.</p>
                                <button class="card-btn">Подробнее</button>
                            </div>
                        </div>
                        <div class="card swiper-slide">
                            <div class="card-image">
                                <div class="card-digit">3.1</div>
                                <img src="img/fig2.png" alt="Fig 2">
                            </div>
                            <div class="card-text">
                                <h3 class="card-title">Fig. 2 (flower)</h3>
                                <p class="text">Прежде всего, синтетическое тестирование влечет за собой процесс внедрения и модернизации условий.</p>
                                <button class="card-btn">Подробнее</button>
                            </div>
                        </div>
                    </div>
                    
                </div>
                <div class="stepper-box">
                    <button id="stepper_left" disabled>
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
                            <path d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.2 288 416 288c17.7 0 32-14.3 32-32s-14.3-32-32-32l-306.7 0L214.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/>
                        </svg>
                    </button>
                    <div class="swiper-pagination"></div>
                    <button id="stepper_right">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
                            <path d="M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z"/>
                        </svg>
                    </button>
                </div>
            </div>
        </section>
        <style>

        </style>
        <section id="about">
            <div class="about-container container">
                <h2 class="section-heading">Новые артефакты</h2>
                <div class="about-box">
                    <div class="images-box">
                        <div class="about-image">
                            <img src="img/about-card.png" alt="about image">
                            <a href="#">Swipe to see more
                                <svg width="136" height="16" viewBox="0 0 136 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M135.702 8.71233C136.095 8.3247 136.1 7.69156 135.712 7.29815L129.396 0.887225C129.008 0.493818 128.375 0.489128 127.982 0.876749C127.588 1.26437 127.583 1.89752 127.971 2.29092L133.586 7.98952L127.887 13.6043C127.494 13.9919 127.489 14.6251 127.877 15.0185C128.264 15.4119 128.898 15.4166 129.291 15.029L135.702 8.71233ZM-0.0074072 7.99997L134.993 8.99997L135.007 7.00003L0.0074072 6.00003L-0.0074072 7.99997Z"/>
                                </svg> 
                            </a>
                        </div>
                    </div>
                    <div class="text-box">
                        <div class="content-box">
                            <h3>Kurische Nehrung 24</h3>
                            <p>Вот вам яркий пример современных тенденций — начало повседневной работы по формированию позиции выявляет срочную потребность методов управления процессами.</p>
                            <p>Есть над чем задуматься: представители современных социальных резервов своевременно верифицированы.</p>
                        </div>
                        <a href="#" class="transition-link-2">Читать далее
                            <svg width="58" height="16" viewBox="0 0 58 16" xmlns="http://www.w3.org/2000/svg">
                                <path d="M57.7071 8.70711C58.0976 8.31658 58.0976 7.68342 57.7071 7.29289L51.3431 0.928932C50.9526 0.538408 50.3195 0.538408 49.9289 0.928932C49.5384 1.31946 49.5384 1.95262 49.9289 2.34315L55.5858 8L49.9289 13.6569C49.5384 14.0474 49.5384 14.6805 49.9289 15.0711C50.3195 15.4616 50.9526 15.4616 51.3431 15.0711L57.7071 8.70711ZM0 9L57 9V7L0 7L0 9Z"/>
                            </svg>                       
                        </a>
                    </div>
                </div>
            </div>
        </section>
        <section id="contacts">
            <div class="container">
                <div class="contacts-container">
                    <h2 class="section-heading">Помочь проекту</h2>
                    <p>Равным образом, экономическая повестка сегодняшнего дня не даёт нам иного выбора, кроме определения прогресса профессионального сообщества. Как принято считать, элементы политического процесса рассмотрены исключительно в разрезе маркетинговых и финансовых предпосылок. </p>
                    <form action="#" class="contacts-form">
                        <label for="name">
                            <div class="error-message" id="name-err"></div>
                            <input type="text" class="default-inp" id="name" placeholder="Имя">
                        </label>
                        <label for="email">
                            <div class="error-message" id="email-err"></div>
                            <input type="text" class="default-inp" id="email" placeholder="Email">
                        </label>
                        <button id="send-btn" class="send-btn" type="button">Отправить</button>
                    </form>
                </div>
            </div>
        </section>
    </main>
    <footer>
        <div class="social-nets">
            <a href="#" class="social-net-link">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
                    <path d="M549.7 124.1c-6.3-23.7-24.8-42.3-48.3-48.6C458.8 64 288 64 288 64S117.2 64 74.6 75.5c-23.5 6.3-42 24.9-48.3 48.6-11.4 42.9-11.4 132.3-11.4 132.3s0 89.4 11.4 132.3c6.3 23.7 24.8 41.5 48.3 47.8C117.2 448 288 448 288 448s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zm-317.5 213.5V175.2l142.7 81.2-142.7 81.2z"/>
                </svg>
            </a>
            <a href="#" class="social-net-link">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
                    <path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/>
                </svg>
            </a>
            <a href="#" class="social-net-link">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
                    <path d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64h98.2V334.2H109.4V256h52.8V222.3c0-87.1 39.4-127.5 125-127.5c16.2 0 44.2 3.2 55.7 6.4V172c-6-.6-16.5-1-29.6-1c-42 0-58.2 15.9-58.2 57.2V256h83.6l-14.4 78.2H255V480H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64z"/>
                </svg>
            </a>
            <a href="#" class="social-net-link">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
                    <path d="M459.4 151.7c.3 4.5 .3 9.1 .3 13.6 0 138.7-105.6 298.6-298.6 298.6-59.5 0-114.7-17.2-161.1-47.1 8.4 1 16.6 1.3 25.3 1.3 49.1 0 94.2-16.6 130.3-44.8-46.1-1-84.8-31.2-98.1-72.8 6.5 1 13 1.6 19.8 1.6 9.4 0 18.8-1.3 27.6-3.6-48.1-9.7-84.1-52-84.1-103v-1.3c14 7.8 30.2 12.7 47.4 13.3-28.3-18.8-46.8-51-46.8-87.4 0-19.5 5.2-37.4 14.3-53 51.7 63.7 129.3 105.3 216.4 109.8-1.6-7.8-2.6-15.9-2.6-24 0-57.8 46.8-104.9 104.9-104.9 30.2 0 57.5 12.7 76.7 33.1 23.7-4.5 46.5-13.3 66.6-25.3-7.8 24.4-24.4 44.8-46.1 57.8 21.1-2.3 41.6-8.1 60.4-16.2-14.3 20.8-32.2 39.3-52.6 54.3z"/>
                </svg>
            </a>
        </div>
        <div class="copyright-box">f&b ® 2020</div>
    </footer>
    <script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
    <script src="js/main.js"></script>
</body>
</html>

